{extend name="public/info_base"}

{block name="title"}
博鳌酒业峰会 -- 在线支付
{/block}

{block name="style"}
<link rel="stylesheet" href="__STATIC__/home/css/summary.css">
<link rel="stylesheet" href="__STATIC__/home/css/jwh.css">
<style>
    .weui-cell {
        background-color: #fff;
    }
    .weui-cell {
        padding: 30px 30px;
        position: relative;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        align-items: center;
        font-size: 22px;
    }
    .order_btn{
        margin-bottom: 100px;
    }
    .weui-cell__bd {
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        flex: 1;
    }
    @media screen and (max-width: 500px){
        .zhe{
            position: fixed;
            top:0;
            left:0;
            right: 0;
            bottom: 0;
            background:#f5f5f5;
        }
        .weui-cell {
            background-color: #fff;
        }
        .weui-cell {
            font-size: .7rem;
            padding: 10px 0;
            position: relative;
            display: -webkit-box;
            display: -webkit-flex;
            display: flex;
            -webkit-box-align: center;
            -webkit-align-items: center;
            align-items: center;
        }
        .weui-cell__bd {
            -webkit-box-flex: 1;
            -webkit-flex: 1;
            flex: 1;
        }
        .weui-cell{
            padding: 10px 15px;
        }
        .weui-cell__hd{
            position: absolute;
            left: 15px;
            top:10px;
        }
        .order_btn{
            display: block;
            position: relative;z-index: 10;
            margin-top: 1rem;
        }
        .order_btn{
            display: block;
            position: relative;z-index: 10;
            margin-top: 1rem;
        }
        .articleList-little .order_btn .formList_btn {
            width: 13.2rem;
            height: 3.42rem;
            line-height: 3.42rem;
            font-size: 1.1rem;
        }
    }

</style>
{/block}

{block name="body"}
<div class="articleList-big">
    {include file="public/header" /}
    {include file="public/nav" /}
    <div class="classify">
        <div class="classify-top">
            <img src="__STATIC__/home/images/boao.png" alt="">
        </div>
        <div class="weui-cell bg-f7">
            <div class="weui-cell__bd">
                <span class="">订单信息</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">姓名</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.username} </span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">性別</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{if $order.sex eq 1}男{else}女{/if}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">手机号</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.mobile}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">邮箱</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.email}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">公司名</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.company}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">公司地址</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.address}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">订单号</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.order_sn}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">付款金额</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span class="cl-9d">￥3900</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">备注信息</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.remark}</span>
            </div>
        </div>
        <div class="order_btn">
            <img src="" style="width: 100px; height: 100px;" class="qr_code"> 扫码支付
        </div>
    </div>
    <div class="clear"></div>
    {include file="public/footer" /}
</div>
<div class="articleList-little">
    <div class="zhe">

    </div>
    <div class="classify">
        <div class="classify-top">
            <img src="__STATIC__/home/images/boao.png" alt="">
        </div>
        <div class="weui-cell bg-f7">
            <div class="weui-cell__bd">
                <span class="">订单信息</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">姓名</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.username} </span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">性別</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{if $order.sex eq 1}男{else}女{/if}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">手机号</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.mobile}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">邮箱</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.email}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">公司名</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.company}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">公司地址</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.address}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">订单号</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.order_sn}</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">付款金额</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span class="cl-9d">￥3900</span>
            </div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__hd">
                <span class="cl-9999">备注信息</span>
            </div>
            <div class="weui-cell__bd text-center">
                <span>{$order.remark}</span>
            </div>
        </div>
        <div class="order_btn">
            <a href="javascript:;"  class="formList_btn wx_pay" data-order-id="{$order.id}">在线支付</a>
        </div>
    </div>
</div>
{/block}

{block name="javascript"}
<script src="__STATIC__/admin/lib/home/jquery_weui/js/jquery-weui.js"></script>
<script>
$(function () {
   // 获取支付二维码
    var _order_id = {$order.id};
    $.get("{:url('get_qr_code')}", {order_id : _order_id, url : window.location.href}, function (msg) {
        //console.log(msg);
        if (msg.code == 200) {
            $(".qr_code").attr('src', '/' + msg.path);
        }
    });

    // 点击支付按钮
    $('.wx_pay').click(function () {
        $.showLoading();
        var _this = $(this);
        $.ajax({
            type : 'POST',
            url : '?',
            data : {
                'order_id' : _this.data('order-id')
            },
            dataType : 'json',
            success : function (msg) {
                if(msg.code == 200) {
                    console.log(msg);
                    $("body").append(msg.tpl);
                    $(".weui-loadmore").hide();
                    callpay()
                }else {
                    alert('系统繁忙，请重试！');
//                    window.location.reload();
                }
            }
        });
    });
});
</script>
{/block}